.countdown {
    margin-right: 34%;
    font-weight: bold;
}

.fl {
    float: left
}

.fr {
    float: right
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: ".";
    clear: both;
    height: 0
}

.chat_flex {
    width: 62px;
    height: 475px;
    position: fixed;
    right: 0px;
    top: 0;
    bottom: 0;
    margin: auto 0;
    z-index: 2
}

.chat_flex ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.chat_flex li {
    width: 60px;
    height: 62px;
    border: 1px solid #e3e3e3;
    border-bottom: none;
    background: #fff;
    cursor: pointer;
    vertical-align: bottom;
    border-bottom: 1px solid #e0e0e0;
}

.chat_flex li.l5 {
    height: auto;
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 4px;
}

.chat_flex li i {
    display: block;
    font: 12px/14px "Microsoft YaHei";
    color: #333;
    text-align: center;
    margin-top: 4px;
}

.chat_flex li.on i {
    color: #fff;
}

.chat_flex li.on {
    background-color: #fb572b;
}

.chat_flex li.l1 em {
    width: 32px;
    height: 32px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_online_01.png) no-repeat center;
}

.chat_flex li.l1.on span {
    width: 32px;
    height: 32px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_online_01_a.png) no-repeat center;
}

.chat_flex li.l2 em {
    width: 32px;
    height: 32px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_app_01.png) no-repeat center;
}

.chat_flex li.l2.on span {
    width: 32px;
    height: 32px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_app_01_a.png) no-repeat center;
}

.chat_flex li.l3 em {
    width: 32px;
    height: 32px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_gzh_01.png) no-repeat center;
}

.chat_flex li.l3.on span {
    width: 32px;
    height: 32px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_gzh_01_a.png) no-repeat center;
}

.chat_flex li.l4 em {
    width: 32px;
    height: 32px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_dy_01.png) no-repeat center;
}

.chat_flex li.l4.on span {
    width: 32px;
    height: 32px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_dy_01_a.png) no-repeat center;
}

.chat_flex li.l5 em {
    width: 28px;
    height: 13px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_back_01.png) no-repeat center;
}

.chat_flex li.l5.on span {
    width: 28px;
    height: 13px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_back_01_a.png) no-repeat center;
}

.chat_flex li.l6 em {
    width: 32px;
    height: 32px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_xcx_01.png) no-repeat center;
    background-size: contain;
}

.chat_flex li.l6.on span {
    width: 32px;
    height: 32px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_xcx_01_a.png) no-repeat center;
    background-size: contain;
}
.chat_flex li.l7 em {
    width: 32px;
    height: 32px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_xhs_01.png) no-repeat center;
    background-size: contain;
}

.chat_flex li.l7.on span {
    width: 32px;
    height: 32px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_xhs_01_a.png) no-repeat center;
    background-size: contain;
}

.chat_flex li.l8 em {
    width: 32px;
    height: 32px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_sph_01.png) no-repeat center;
    background-size: contain;
}

.chat_flex li.l8.on span {
    width: 32px;
    height: 32px;
    background: url(//upload.hteacher.net/webupload/common/chat/chat_sph_01_a.png) no-repeat center;
    background-size: contain;
}

.chat_flex li span {
    display: none;
    margin: 8px auto 0 auto
}

.chat_flex li.l5 span {
    margin: 12px auto 0 auto
}

.chat_flex li em {
    display: block;
    margin: 8px auto 0 auto
}

.chat_flex li.l5 em {
    margin: 12px auto 0 auto
}

.chat_flex li.on {
    border-color: #e0e0e0;
    width: 62px;
}

.chat_flex li.on em {
    display: none
}

.chat_flex li.on span {
    display: block
}

.chat_flex li a,
.chat_flex li p {
    position: relative;
    width: 100%;
    height: 100%
}

.chat_flex li .temp_ewm {
    position: absolute;
    left: -170px;
    top: -36px;
    display: none;
    max-width: -moz-fit-content;
}